<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8" />
<title>登录</title>
	<!--清除缓存-->
	<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
	<meta http-equiv="Pragma" content="no-cache">
	<meta http-equiv="Expires" content="0">

<link rel="stylesheet" type="text/css" href="login/css/index.css" />
	<script src="jquery/jquery-3.6.0.js"></script>
</head>

<body>

<img class="bgone" src="login/img/1.jpg" />
<img class="pic" src="login/img/a.png" />

<div class="table">
	<div class="wel">无霸哥超强后台管理系统登录</div>
	<div class="wel1">NO BUG</div>
	<div class="user">
		<div id="yonghu" style=""><img src="login/img/yhm.png" /></div>
		<input type="text" id="username" name="" placeholder="用户名" value=""/>
	</div>			
	<div class="password">
		<div id="yonghu"><img src="login/img/mm.png" /></div>
		<input type="password" id="password" name="密码" placeholder="输入密码" value=""/>
	</div>
	<input class="btn" type="button" id="loginButton" name="登录" value="登录" />
</div>

</body>
<script>
	$(function () {
		$("#loginButton").click(function () {
			let username = $("#username").val();
			let password = $("#password").val();
			$.ajax({
				url:"/user/login",           // 请求路径
				type:"post",                  // 请求的方式，不区分大小写
				cache:false,                  // 关闭缓存，目的是为了避免部分浏览器缓存加载出错(IE)
				data: {
					username:username,
					password:password
				},
				datatype:"json",        // 返回类型，text文本、html页面、json数据
				success:function(response){
					console.log("返回: " + response);
					alert(response.msg);
					if(response.code === 200) {
						// sessionStorage;   // 当前单张页面有效(java session是当前浏览器有效)，关闭此页面失效(java session关闭浏览器失效)
						// localStorage;     // 整个浏览器有效，关闭浏览器也有效
						// Storage只能存放普通的字符串，不能存放任何的对象，所以需要手动序列化对象
						// sessionStorage.setItem("userObj", JSON.stringify(jsonObj));
						// let jsonObj =  JSON.parse(sessionStorage.getItem("userObj"));
						sessionStorage.setItem("username", username);
						window.location.href = "index.html";
					}
				},
				error:function(response){
					console.log("出错返回: " + response);
				}
			});
		});
	});
</script>
</html>